<template>
	<view class="add_box">
		<view class="contact_xy">
			<view class="scroll_box">
				<view class="scroll_box_cont">
					<!-- 已添加的商品列表 end -->
					<uni-forms
						ref="baseForm"
						:model="orderData"
						label-position="top"
						label-width="120"
					>
						<view class="uni_form">
							<uni-forms-item required label="选择商品">
								<view class="add_pro" v-if="is_oneGoods">
									<view class="way_item" @click="showCode">
										<uni-icons
											type="scan"
											color="#007cff"
											size="18"
										></uni-icons>
										<span class="custom-title">扫码添加</span>
									</view>
									<view class="way_item" @click="addGoods">
										<uni-icons
											type="plus"
											color="#007cff"
											size="18"
										></uni-icons>
										<span class="custom-title">添加商品</span>
									</view>
								</view>
							</uni-forms-item>

							<view
								class="multiple-fill-buy-mall-time"
								@click="showFillBuyMallAndTimePopup"
							>
								<view class="btn">批量填充购买商场和时间</view>

								<view class="icon">
									<uni-icons type="right" :size="14"></uni-icons>
								</view>
							</view>

							<!-- 添加商品列表 -->
							<view
								class="por_card"
								v-if="orderData.orderGoodsTypes.length > 0"
							>
								<view
									class="type-list"
									v-for="(type, typeIndex) in orderData.orderGoodsTypes"
									:key="typeIndex"
								>
									<view
										class="goods_item"
										v-for="(item, index) in type.orderGoodsVos"
										:key="index"
									>
										<view class="goods_item_left">
											<view class="item_img">
												<image
													:src="item.image"
													v-if="item.image"
													@click="lookImg(item.image)"
													class="_img"
													mode="aspectFill"
												></image>
												<uni-icons
													color="#aac"
													size="48"
													v-else
													type="image"
												></uni-icons>
											</view>
											<view class="item_title">
												<view class="item_title_header">
													<view class="item_title_text_brand">
														{{ item.name }}
													</view>
													<view class="delete_item">
														<uni-icons
															type="minus-filled"
															size="24"
															class="del_btn"
															@click="handleGoodDel(item)"
															color="#FF5733"
														></uni-icons>
													</view>
												</view>
												<view class="item_title_text">
													<span>编号：</span>
													<span class="item_title_color">
														{{ item.goodsCode }}
													</span>
												</view>
												<!-- <view class="item_title_text">
													<span>型号：</span>
													<span class="item_title_color">
														{{ item.model }}
													</span>
												</view> -->
												<view class="item_title_text">
													<span>数量：</span>
													<span class="item_title_color">1</span>
												</view>
												<view class="item_title_text">
													<span>规格：</span>
													<span class="item_title_color">
														{{ item.specName }}
													</span>
												</view>
												<view class="item_title_code" v-if="item.code">
													<span>一物一码：</span>
													<span class="item_title_color">
														{{ item.code }}
													</span>
												</view>
												<view class="item_title_text">
													<span>质保到期时间：</span>
													<span class="item_title_color">
														{{ item.endTime }}
													</span>
												</view>
												<!-- <view class="number">
													×1 -->
												<!-- <uni-number-box
														v-if="!(item.typeGoods == 1)"
														style="transform: scale(0.9)"
														v-model="item.qty"
														:min="1"
													/> -->
												<!-- </view> -->
											</view>
										</view>
										<uni-forms-item label="购买商场">
											<uni-easyinput
												v-model="item.buyMarket"
												placeholderStyle="font-size:28rpx;"
												maxlength="15"
												placeholder="请输入"
											/>
										</uni-forms-item>
										<uni-forms-item label="购买时间">
											<uni-datetime-picker
												v-model="item.buyTime"
												:start="'1990-01-01'"
												:end="'2040-12-31'"
												:hide-second="true"
												type="date"
											/>
										</uni-forms-item>
									</view>
								</view>
							</view>
							<!-- 选择上门时间  先隐藏-->
							<!-- <uni-forms-item class="address_item" label="期望时间"
								style="margin-bottom: 0;padding-top: 20rpx;">
								<view class="sel_address" @click="chackTime">
									<view class="text_9" v-if="!orderData.expectedStartTime">
										选择上门时间
									</view>
									<view class="" v-else>
										{{store.state.appointmentTime?.dateVal.text}}
										&nbsp;{{store.state.appointmentTime?.time}}
									</view>
									<uni-icons style="padding-left: 10px;" type="right" size="14"
										color="#999"></uni-icons>
								</view>
							</uni-forms-item> -->
							<view class="address_item_">
								<uni-forms-item
									required
									label="客户信息"
									label-position="left"
									:rules="[{required: true, errorMessage: '客户信息'}]"
									:name="['orderUser', 'province']"
									class="address_item"
								>
									<view class="sel_address">
										<view
											class="text_9"
											@click="popupshow2"
											v-if="!store.state.userOrder.phone"
										>
											请输入客户信息
										</view>
										<view v-else style="">
											<view class="tipadd" style="column-gap: 12rpx">
												<uni-icons
													@click="editAddressFn()"
													size="22"
													style="margin-left: 12rpx"
													color="#007cff"
													type="compose"
												></uni-icons>
												<span @click="popupshow2" class="user_name">
													{{ store.state.userOrder.name }}
												</span>
												<span @click="popupshow2">
													{{ store.state.userOrder.phone }}
												</span>
											</view>
											<view
												style="
													word-wrap: break-word;
													word-break: break-all;
													color: #777;
													text-align: right;
													font-size: 26rpx;
												"
											>
												<span @click="popupshow2">
													{{
														[
															store.state.userOrder.province,
															store.state.userOrder.city,
															store.state.userOrder.area,
															store.state.userOrder.address,
														]
															.filter((o) => o)
															.join('')
													}}
												</span>
											</view>
										</view>
										<uni-icons
											type="right"
											@click="popupshow2"
											size="14"
											color="#999"
											style="padding-left: 10px"
										></uni-icons>
									</view>
								</uni-forms-item>
							</view>
							<!-- 隐藏 -->
							<!-- 	<view class="" v-if="store.state.wayType.type!=1">
								<uni-forms-item label="故障分类">
									<zxz-uni-data-select style="width: 100%;" @change="getFaultByFaultType()"
										:collapseTags="true" :collapseTagsNum="5" multiple
										:localdata="faultTypeRelationVos"
										v-model="orderData.faultTypeRelationVos"></zxz-uni-data-select>
								</uni-forms-item>
								<uni-forms-item label="故障现象" :disabled="!(faultList.length>0)">
									<zxz-uni-data-select dataValue="id" dataKey="name" :filterable="true"
										style="width: 100%;" @change="faultIdsFn" :collapseTags="true"
										:collapseTagsNum="5" multiple :localdata="faultList"
										v-model="orderData.faultRelationVos"></zxz-uni-data-select>
								</uni-forms-item>
								<uni-forms-item label="故障原因">
									<zxz-uni-data-select dataValue="id" dataKey="content" :filterable="true"
										style="width: 100%;" :collapseTags="true" :collapseTagsNum="5" multiple
										:localdata="faultReasonList"
										v-model="orderData.faultReason"></zxz-uni-data-select>
								</uni-forms-item>
								<uni-forms-item label="解决措施">
									<zxz-uni-data-select dataValue="id" dataKey="content" :filterable="true"
										style="width: 100%;" :collapseTags="true" :collapseTagsNum="5" multiple
										:localdata="solutionList" v-model="orderData.solution"></zxz-uni-data-select>
								</uni-forms-item>
							</view> -->
							<view
								class="link"
								v-if="orderData.workFieldVal.length > 0"
								style="margin-bottom: 20rpx"
							></view>
							<view
								v-for="(item, index) in orderData.workFieldVal"
								:key="index"
							>
								<uni-forms-item
									:label="item.name"
									:required="item.required"
									:name="[
										'workFieldVal',
										index,
										item.type === 5 || item.type === 6 || item.type === 7
											? 'imgarr'
											: 'value',
									]"
									:rules="[{required: item.required, errorMessage: item.name}]"
								>
									<view
										class="team_type"
										:class="{
											team_type_:
												(item.type === 4 && item.contents.length <= 3) ||
												item.type == 8 ||
												(item.type === 3 && item.contents.length <= 3),
										}"
									>
										<!-- 文本1 -->
										<uni-easyinput
											v-model="item.value"
											v-if="item.type === 1"
											placeholderStyle="font-size:28rpx;"
											:placeholder="item.tip"
										/>
										<!-- 多行文本2 -->
										<uni-easyinput
											trim="right"
											autoHeight
											v-model="item.value"
											type="textarea"
											v-if="item.type === 2"
											placeholderStyle="font-size:28rpx;"
											:placeholder="item.tip || '请输入'"
										/>
										<!-- 单选 3-->
										<uni-data-select
											style="width: 100%"
											v-model="item.value"
											v-if="item.type === 3 && item.contents.length > 3"
											:localdata="item.contents"
										></uni-data-select>
										<uni-data-checkbox
											v-model="item.value"
											v-else-if="item.type === 3"
											:localdata="item.contents"
										></uni-data-checkbox>
										<!-- 多选4 -->
										<uni-data-checkbox
											v-if="item.type === 4 && item.contents.length <= 3"
											multiple
											v-model="item.value"
											:localdata="item.contents"
										></uni-data-checkbox>
										<zxz-uni-data-select
											style="width: 100%"
											:collapseTags="true"
											:collapseTagsNum="1"
											v-else-if="item.type === 4"
											multiple
											:localdata="item.contents"
											v-model="item.value"
										></zxz-uni-data-select>
										<!-- 图片 5 -->
										<view class="pic_img" v-if="item.type === 5">
											<uni-file-picker
												@select="(files) => onsuccessImg2(item, files)"
												:auto-upload="false"
												@delete="(file) => ondeleteImg2(item, file)"
												:imageStyles="imageStyles"
												file-mediatype="image"
												v-model="item.imgarr"
												:limit="item.uploadQty"
											/>
										</view>
										<!-- 附件6 -->
										<view class="pic_video" v-if="item.type === 6">
											<view
												class="list_video"
												v-for="(src, imgIndex) in item.imgarr"
												:key="imgIndex"
											>
												<view class="box_video_pdf">
													<uni-icons
														type="closeempty"
														@click="delete_video(item, imgIndex)"
														class="clear_icon"
														size="14"
														color="#fff"
													></uni-icons>
													<view class="pdf_sty" @click="lookPDF(src.url)">
														PDF
													</view>
												</view>
											</view>
											<view
												class="btn_uploader"
												v-if="item.uploadQty > item.imgarr.length"
											>
												<uni-icons
													type="plusempty"
													class="icon_plus"
													size="18"
													color="#999"
												></uni-icons>
												<uni-file-picker
													file-extname="pdf"
													fileMediatype="all"
													v-model="item.imgarr"
													:auto-upload="false"
													@select="(file) => chooseFile(item, file)"
												/>
											</view>
										</view>
										<!-- 视频7 -->
										<view class="pic_video" v-if="item.type === 7">
											<view
												class="list_video"
												v-for="(src, imgIndex) in item.imgarr"
												:key="imgIndex"
											>
												<view class="box_video">
													<uni-icons
														type="closeempty"
														@click="delete_video(item, imgIndex)"
														class="clear_icon"
														size="14"
														color="#fff"
													></uni-icons>
													<video
														:src="src.url"
														@click="videoUrlShow(src.url)"
														:controls="false"
														:enable-progress-gesture="false"
														:show-center-play-btn="false"
														class="item_video"
													></video>
												</view>
											</view>
											<view
												class="btn_uploader"
												v-if="item.uploadQty > item.imgarr.length"
											>
												<uni-icons
													type="plusempty"
													class="icon_plus"
													size="18"
													color="#999"
												></uni-icons>
												<uni-file-picker
													fileMediatype="video"
													mode="grid"
													file-extname="mp4,mov"
													:auto-upload="false"
													@select="(file) => chooseVideoImage(item, file)"
												/>
											</view>
										</view>
										<!-- 评分8 -->
										<uni-rate
											v-if="item.type === 8"
											v-model="item.value"
											margin="10"
										/>
										<uni-datetime-picker
											v-if="item.type === 9"
											type="date"
											:clear-icon="false"
											v-model="item.value"
										/>
										<uni-datetime-picker
											:hide-second="true"
											v-if="item.type === 10"
											type="datetime"
											v-model="item.value"
										/>
									</view>
								</uni-forms-item>
							</view>
							<view class="mg_top">
								<uni-forms-item label="工单描述">
									<view class="message">
										<!-- <view class="big_input">
											<template v-for="(val,index1) in faultTypeList()" :key="index1">
												<view @click="setFaultType(val)" class="input_item">
													{{val.name}}<uni-icons class="icon_close" type="closeempty"
														color="#d4d4d4"></uni-icons>
												</view>
											</template>
										</view> -->
										<textarea
											maxlength="200"
											placeholderStyle="font-size:24rpx;color:#999"
											placeholder="请输入机器故障现象或补充其他说明，如：漏水、不加热、不通电、不显示"
											:auto-height="true"
											:autosize="false"
											v-model="orderData.content"
										/>
										<p
											style="
												text-align: right;
												font-size: 24rpx;
												color: #999;
												padding: 4px;
											"
										>
											{{ orderData.content.length }}/200
										</p>
									</view>
								</uni-forms-item>
								<uni-forms-item>
									<template #label>
										<view class="tiao_jian">
											<span class="custom-title">图片</span>
											<view class="text">
												(上传机器整体图片,铭牌图片,购买凭证,允许上传9张)
											</view>
										</view>
									</template>
									<view class="pic_img">
										<uni-file-picker
											@select="onsuccessImg"
											file-extname="jpg,jpeg,png"
											:auto-upload="false"
											@delete="ondeleteImg"
											:imageStyles="imageStyles"
											:sizeType="['original', 'compressed']"
											:sourceType="['album', 'camera']"
											file-mediatype="image"
											v-model="fileList"
											limit="9"
										/>
									</view>
								</uni-forms-item>
							</view>
						</view>
					</uni-forms>
				</view>
			</view>
		</view>
		<view class="address_btn">
			<view class="btn_addres">
				<button type="primary" class="btn" @click="onsubService">
					{{ workId ? '保存修改' : '提交工单' }}
				</button>
			</view>
		</view>
	</view>
	<!--选择服务地址 弹窗  str -->
	<uni-popup ref="showAddpopup" :safe-area="false" type="bottom">
		<view class="popup_main">
			<view class="lable_top">
				选择客户信息
				<uni-icons
					class="icon"
					color="#aaa"
					@click="showAddpopup.close()"
					size="22"
					type="closeempty"
				></uni-icons>
			</view>
			<view class="search_card">
				<uni-search-bar
					:focus="false"
					class="search_card_bar"
					@confirm="getNetworkOrderUserAddr()"
					placeholder="请输入客户名称或手机号查询"
					radius="100"
					bg-color="rgba(242, 243, 245, 1)"
					cancelButton="none"
					v-model="searchNamePhone"
					@input="getNetworkOrderUserAddr()"
				></uni-search-bar>
				<view class="search_btn" @click="getNetworkOrderUserAddr()">搜索</view>
			</view>
			<view class="add_address">
				<span @click="addUserAddress()">没有客户信息？去添加！</span>
			</view>
			<radio-group class="sele_ul" v-if="addressSelectList.length > 0">
				<view
					class="sele_li"
					v-for="(item, index) in addressSelectList"
					:key="index"
				>
					<view class="sele_li_item" @click="itemUser(item)">
						<radio
							:value="item.id"
							@click="itemUser(item)"
							color="#007cff"
							style="transform: scale(0.8)"
							:checked="chackUseritem?.id == item.id"
						/>
						<view class="add_ed">
							<view class="user_xx">
								<span class="user_name">{{ item.username }}</span>
								&nbsp; &nbsp;{{ item.phone }}
								<view class="tip" v-if="item.mainContact">默认</view>
							</view>
							<view>
								{{
									[item.province, item.city, item.area]
										.filter((o) => o)
										.join('')
								}}
							</view>
							<view class="text">
								{{ item.address }}
							</view>
						</view>
					</view>
					<!-- <uni-icons size="24" color="#666" type="compose" @click="editItem(item)"></uni-icons> -->
				</view>
			</radio-group>
			<view
				v-if="addressSelectList.length == 0 && !searchNamePhone"
				style="
					display: flex;
					justify-content: center;
					align-items: center;
					color: #999;
					font-size: 24rpx;
					height: 30%;
				"
			>
				请输入客户名称或手机号查询...
				<uni-icons type="search" color="#999"></uni-icons>
			</view>
			<view
				v-else-if="addressSelectList.length == 0"
				style="
					display: flex;
					justify-content: center;
					align-items: center;
					color: #999;
					font-size: 24rpx;
					height: 30%;
				"
			>
				查询无数据...
				<uni-icons type="search" color="#999"></uni-icons>
			</view>
			<view class="add_btn">
				<button class="btn" @click="selecAddress()">确定</button>
			</view>
		</view>
	</uni-popup>
	<!--选择上门时间 弹窗  str -->
	<TimePopup
		@set-popup="showpopup = $event"
		@value-change="valueChange"
		:showpopup="showpopup"
	></TimePopup>
	<uni-popup ref="popup" type="center" class="scan-query-popup">
		<view class="add_main">
			<p class="text_top_popup">
				扫码查询
				<uni-icons
					class="icon"
					color="#aaa"
					@click="popup && popup.close()"
					size="20"
					type="closeempty"
				></uni-icons>
			</p>
			<uni-easyinput
				suffixIcon="scan"
				placeholderStyle="font-size:28rpx;"
				v-model="code"
				placeholder="请输入条码"
				@iconClick="iconClick"
			></uni-easyinput>
			<button class="onlogout" @click="addCode"><span>确定</span></button>
		</view>
	</uni-popup>
	<uni-popup ref="popupvideoRef" background-color="#fff" @change="urlClickShow">
		<video
			:src="videoUrl"
			:enable-progress-gesture="false"
			:show-center-play-btn="false"
		></video>
	</uni-popup>
	<EditAddress
		:userFormData="orderUser"
		@set-popup="showBottom = $event"
		@value-change="userAddressChange"
		:showpopup="showBottom"
	></EditAddress>

	<uni-popup ref="fillBuyMallAndTimePopup" type="center">
		<view class="fill-buy-mall-time-popup-container">
			<view class="header">
				<view class="placeholder">
					<uni-icons type="closeempty" :size="14"></uni-icons>
				</view>
				<view class="title">批量更改购买商场和时间</view>
				<view class="close-btn" @click="hideFillBuyMallAndTimePopup">
					<uni-icons type="closeempty" :size="14"></uni-icons>
				</view>
			</view>
			<view class="form">
				<view class="mall">
					<view class="label">购买商场：</view>
					<view class="value">
						<uni-easyinput
							placeholder="请输入购买商场"
							maxlength="15"
							v-model="fillBuyMallAndTimeForm.mall"
						></uni-easyinput>
					</view>
				</view>
				<view class="time">
					<view class="label">购买时间：</view>
					<view class="value">
						<picker
							mode="date"
							:value="fillBuyMallAndTimeForm.time"
							:start="'1990-01-01'"
							:end="'2040-12-31'"
							@change="handleChangeBuyTime"
						>
							<view class="date">
								<uni-icons type="calendar" :size="18" color="#999"></uni-icons>
								<view class="txt">
									{{
										fillBuyMallAndTimeForm.time
											? fillBuyMallAndTimeForm.time
											: '请选择购买时间'
									}}
								</view>
							</view>
						</picker>
					</view>
				</view>
			</view>
			<view class="footer">
				<view class="confirm-btn" @click="onConfirmFillButMallAndTime">
					确定
				</view>
				<view class="divider"></view>
				<view class="cancel-btn" @click="hideFillBuyMallAndTimePopup">
					取消
				</view>
			</view>
		</view>
	</uni-popup>
</template>

<script setup lang="ts">
	import {ref, onMounted, watch} from 'vue';
	import {onLoad, onUnload, onShow} from '@dcloudio/uni-app';
	import store from '@/store_network/index.js';
	import apiOrder from '@/util/network_api/apiOrder.js';
	import apiUpload from '@/util/network_api/upload.js';
	import TimePopup from '@/components/u-user/TimePopup.vue';
	import EditAddress from '@/components/editAddress.vue';
	import _ from 'lodash';
	// import AreaAddress from '@/components/u-network/AreaAddress.vue'
	// import roleStore from '@/store/role-play.js'

	// 商品删除id集合
	const goodDelIdList = ref<Array<string>>([]);

	// 填充购买商场和时间弹窗
	const fillBuyMallAndTimePopup = ref();

	// 填充商场和时间表单
	const fillBuyMallAndTimeForm = ref({
		mall: '',
		time: '',
	});

	/**
	 * 显示填充购买商场和时间弹窗
	 */
	const showFillBuyMallAndTimePopup = () => {
		if (fillBuyMallAndTimePopup.value) {
			fillBuyMallAndTimePopup.value.open();
		}
	};

	/**
	 * 隐藏填充购买商场和时间弹窗
	 */
	const hideFillBuyMallAndTimePopup = () => {
		if (fillBuyMallAndTimePopup.value) {
			fillBuyMallAndTimePopup.value.close();
			fillBuyMallAndTimeForm.value = {
				mall: '',
				time: '',
			};
		}
	};

	/**
	 * 填充购买时间更新事件
	 * @param {Object} res - 选择的日期
	 */
	const handleChangeBuyTime = (res) => {
		fillBuyMallAndTimeForm.value.time = res.detail.value;
	};

	/**
	 * 购买商场和时间确定事件
	 */
	const onConfirmFillButMallAndTime = () => {
		for (let i = 0; i < orderData.value.orderGoodsTypes.length; i++) {
			const type = orderData.value.orderGoodsTypes[i];
			for (let j = 0; j < type.orderGoodsVos.length; j++) {
				orderData.value.orderGoodsTypes[i].orderGoodsVos[j].buyTime =
					fillBuyMallAndTimeForm.value.time;
				orderData.value.orderGoodsTypes[i].orderGoodsVos[j].buyMarket =
					fillBuyMallAndTimeForm.value.mall;
			}
		}
		hideFillBuyMallAndTimePopup();
	};

	/**
	 * 商品删除事件
	 * @param {Object} item - 商品对象
	 */
	const handleGoodDel = (item) => {
		uni.showModal({
			title: '提示',
			content: '确定要删除该商品？',
			confirmText: '取消',
			cancelText: '删除',
			success: async (res) => {
				if (res.cancel) {
					store.commit('engineerMachineDelGood', item);
					if (item.id) {
						goodDelIdList.value.push(item.id);
					}
				}
			},
		});
	};

	const fileList = ref([]); //上传的图片
	const showAddpopup = ref(null); //选择服务地址弹窗
	const showpopup = ref(false); //选择上门时间 弹窗
	const chackUseritem = ref(); //选择的用户地址Id
	const goodsCode = ref(''); //商品编码
	const isHistory = ref(false); //历史建单
	const popup = ref();
	const code = ref('');
	const is_oneGoods = ref(true);
	const workId = ref(''); //工单单号
	const orderData = ref({
		id: '',
		content: '', //故障描述
		delOrderGoodsIds: [], //删除的工单商品对象ID集合
		expectedDate: '', //期望上门日期 xxxx-xx-xx
		expectedEndTime: '', //期望开始上门时间
		expectedStartTime: '', //期望开始上门时间
		historyOrder: false, //是否历史工单报单：false-否，true-是
		images: [],
		moduleId: '', //工单模块ID
		source: 12, //工单来源有:3-工程师小程序报单，12-工程师H5端报单"
		solution: [
			// {
			//       "content": "",
			//       "id": 0
			//     }
		], //	解决方案/措施
		faultReason: [
			// {
			//       "content": "",
			//       "id": 0
			//     }
		], //	故障原因
		faultRelationVos: [
			// {
			//    "fault": "",
			//    "faultId": 0
			//  },
		],
		faultTypeRelationVos: [
			//工单故障分类对象
			// {
			//   "oneFaultTypeId": 0,
			//   "threeFaultTypeId": 0,
			//   "twoFaultTypeId": 0
			// }
		],
		orderGoodsTypes: [],
		orderUser: {
			address: '', //客户详细地址
			area: '', //地址-县/区
			city: '', //地址-市
			helpOtherCreateOrder: false, //	是否代他人建单：0-否，1-是
			name: '', //客户姓名
			otherPhone: '', //其他电话
			phone: '', //客户手机号
			province: '', //地址-省
			town: '', //地址-镇
			userId: null, //客户ID
			overinsured: false, //质保状态：false-保内，true-保外；historyOrder为true时，此字段才生效
		},
		workFieldVal: [],
	});
	onUnload(() => {
		uni.hideLoading();
	});
	const imageStyles = ref({
		height: 72, // 边框高度
		width: 72, // 边框宽度
		border: {
			// 如果为 Boolean 值，可以控制边框显示与否
			color: '#eee', // 边框颜色
			width: '1px', // 边框宽度
			style: 'solid', // 边框样式
			radius: '0px',
		},
	});
	// 查看视频
	const popupvideoRef = ref();
	const videoUrl = ref('');
	const videoUrlShow = (url) => {
		videoUrl.value = url;
		popupvideoRef.value.open();
	};
	const urlClickShow = (v) => {
		if (!v.show) videoUrl.value = '';
	};
	// 预览图片
	const lookImg = (url) => {
		uni.previewImage({
			urls: [url],
		});
	};

	onLoad(async (e) => {
		uni.showLoading({
			mask: true,
			title: '加载中',
		});

		// #ifdef MP-WEIXIN
		orderData.value.source = 3;
		// #endif
		// #ifndef MP-WEIXIN
		orderData.value.source = 12;
		// #endif
		store.commit('set_is_OrderGoodsIds', []);
		if (e?.type) {
			store.commit('setWayType', {
				id: e.moduleCode,
				name:
					e.type == 1
						? '安装'
						: e.type == 2
						? '维修'
						: e.type == 3
						? '保养'
						: '其他',
				type: e.type, //1安装
			});
		}
		//商品扫码报单
		if (e?.code) {
			// 初始化数据
			goodsCode.value = e.code;
			is_oneGoods.value = false;
			let res = await getgoodsDetail();
			store.commit('setorderGoodsTypes', []);
			if (res.code == 20000) {
				addMyGoods(res.data.row, null, true);
			} else if (res.code == 400305) {
				uni.showModal({
					title: '提示',
					showCancel: false,
					confirmText: '确认',
					confirmColor: '#007cff',
					content: res.message + '或去添加商品',
				});
			}
		}
		workId.value = '';
		if (e?.workId) {
			uni.showLoading({
				title: '加载中...',
				mask: true,
			});
			store.commit('setorderGoodsTypes', []);
			store.commit('setWayType', {});
			store.commit('setcheckBrandItem', {id: null});
			store.commit('setcheckClassifyItem', {id: null});
			store.commit('setappointmentTime', null);
			store.commit('setUserOrder', {
				address: '', //客户详细地址
				area: '', //地址-县/区
				city: '', //地址-市
				helpOtherCreateOrder: false, //	是否代他人建单：0-否，1-是
				name: '', //客户姓名
				otherPhone: '', //其他电话
				phone: '', //客户手机号
				province: '', //地址-省
				town: '', //地址-镇
				userId: null,
			});
			workId.value = e.workId;
			await apiOrder.getBeforeUpdateOrderSelect(e.workId).then((res) => {
				if (res.code == 20000) {
					store.commit('setWayType', {
						id: res.data.row.moduleId,
						name: res.data.row.module,
						type: res.data.row.moduleType,
					});
					uni.setNavigationBarTitle({
						title: store.state.wayType.name,
					});
					orderData.value.content = res.data.row.content;
					orderData.value.id = res.data.row.id;
					orderData.value.solution = res.data.row.solution;
					orderData.value.faultReason = res.data.row.faultReason;
					orderData.value.faultRelationVos = res.data.row.faultRelationVos;
					orderData.value.faultTypeRelationVos =
						res.data.row.faultTypeRelationVos;
					orderData.value.orderUser = res.data.row.orderUser;
					fileList.value = res.data.row.images.map((o) => {
						return {
							name: 'img.png',
							extname: 'png',
							url: o.image,
							id: o.id,
						};
					});
					store.commit('setUserOrder', orderData.value.orderUser);
					let orderGoodsTypes = [];
					store.commit('setorderGoodsTypes', []);
					// 获取商品
					let goodsId = [];
					res.data.row.orderGoodsTypes.map((o) => {
						let orderGoodsVos = [];
						o.orderGoodsVos.map((i) => {
							goodsId.push(i.id);
							orderGoodsVos.push(addMyGoods(i, o.type));
						});
						orderGoodsTypes.push({type: o.type, orderGoodsVos: orderGoodsVos});
					});
					store.commit('set_is_OrderGoodsIds', goodsId); //存修改前商品id

					const goodList = [];
					const customerRegisterGodList = [];
					res.data.row.orderGoodsTypes.forEach((good) => {
						good.orderGoodsVos.forEach((item) => {
							const addGood = {
								type: good.type,
								brandId: item.goodsBrandId,
								checkClassifyList: [
									{
										classifyId: item.goodsOneTypeId,
										orderGoodsVos: [
											{
												brand: item.goodsBrand,
												brandId: item.goodsBrandId,
												buyMarket: item.buyMarket,
												buyTime: item.buyTime,
												code: item.goodsCodes[0] ? item.goodsCodes[0].code : '',
												codeIds: item.codeIds,
												endTime: item.endTime,
												goodsCode: item.goodsCode,
												goodsId: item.goodsId,
												goodsSpecId: item.goodsSpecId,
												id: item.id,
												image: '',
												model: item.goodsModel,
												name: item.goodsName,
												qty: item.qty,
												specName: item.goodsSpec,
												type: item.goodsOneType,
												typeGoods: good.type,
												typeId: item.goodsOneTypeId,
											},
										],
									},
								],
							};

							if (good.type === 3) {
								goodList.push(addGood);
							}

							if (good.type === 1) {
								customerRegisterGodList.push(addGood);
							}
						});
					});

					const commitGoodList = [];
					if (goodList.length > 0) {
						commitGoodList.push(...goodList);
					}
					if (customerRegisterGodList.length > 0) {
						commitGoodList.push(...customerRegisterGodList);
					}
					store.commit('setorderGoodsTypes', commitGoodList);
					// 获取自定义字段
					apiOrder.getModuleField(res.data.row.moduleId).then((res2) => {
						uni.hideLoading();
						if (res2.code == 20000) {
							if (res2.data.rows.length > 0) {
								orderData.value.workFieldVal = res2.data.rows.map((o) => {
									o.contents = o.contents.map((i) => {
										return {
											text: i.val,
											value: i.val,
										};
									});
									if (o.type == 5 || o.type == 6 || o.type == 7) {
										o.imgarr = [];
									} else if (o.type == 4) {
										o.value = [];
									} else {
										o.value = '';
									}
									res.data.row.workFieldVal.map((val) => {
										if (
											val.type == o.type &&
											val.workFieldId == o.workFieldId &&
											o.moduleFieldId == val.moduleFieldId
										) {
											o.id = val.id;
											if (o.type == 5 || o.type == 6 || o.type == 7) {
												o.imgarr = val.optionVos.map((i) => {
													return {
														name: getFileNameAndExtension(i.optValue).fileName,
														extname: getFileNameAndExtension(i.optValue)
															.fileExtension,
														url: i.optValue,
														id: i.id,
													};
												});
											} else if (o.type == 4) {
												o.value = val.optionVos.map((i) => i.optValue) || [];
											} else if (o.type == 8) {
												o.value = Number(val.optionVos[0].optValue) / 2 || '';
											} else {
												o.value = val.optionVos[0].optValue || '';
											}
										}
									});
									return o;
								});
							}
						}
					});
				}
			});
		}
		// 获取文件名和后缀
		const getFileNameAndExtension = (url) => {
			let parts = url.split('/');
			let fileNameWithExtension = parts[parts.length - 1];
			let fileNameParts = fileNameWithExtension.split('.');
			let fileName = fileNameParts[0];
			let fileExtension = fileNameParts[1];
			return {
				fileName,
				fileExtension,
			};
		};
		// *******重新渲染****
		if (store.state.appointmentTime) {
			orderData.value.expectedDate = store.state.appointmentTime?.dateVal.date;
			orderData.value.expectedStartTime =
				store.state.appointmentTime.time.split('~')[0];
			orderData.value.expectedEndTime =
				store.state.appointmentTime.time.split('~')[1];
		}
		token.value = uni.getStorageSync('access-network').token;
		orderData.value.orderUser.address = store.state.userOrder.address; //联系详细地址
		orderData.value.orderUser.area = store.state.userOrder.area; //地址-县/区
		orderData.value.orderUser.city = store.state.userOrder.city; //地址-市
		orderData.value.orderUser.name = store.state.userOrder.name; //联系姓名
		orderData.value.orderUser.phone = store.state.userOrder.phone; //联系手机号
		orderData.value.orderUser.province = store.state.userOrder.province; //地址-省
		orderData.value.orderUser.town = store.state.userOrder.town; //地址-镇
		orderData.value.orderUser.userId = store.state.userOrder.userId; //联系ID
		addressValue.value = {
			province: store.state.userOrder.province, //省
			city: store.state.userOrder.city, //市
			area: store.state.userOrder.area, //区
			town: store.state.userOrder.town, //镇
		};
		uni.hideLoading();
		// ******end*******
		if (e?.workId) return;
		if (store.state.wayType.id) getModuleField(store.state.wayType.id);
	});
	const endTime = ref();
	onMounted(() => {
		let now = new Date();
		endTime.value = now.toLocaleString();
		// 设置申请类型标题
		if (store.state.wayType.id) {
			uni.setNavigationBarTitle({
				title: store.state.wayType.name,
			});
		}
	});
	// 编辑地址
	const showBottom = ref(false);
	const editAddressFn = () => {
		orderUser.value = orderData.value.orderUser;
		showBottom.value = true;
	};
	const orderUser = ref({
		address: '',
		area: '',
		city: '',
		phone: '',
		province: '',
		town: '',
		name: '',
		userId: '',
	});
	// 添加服务地址
	const addUserAddress = () => {
		orderUser.value = {
			address: '',
			area: '',
			city: '',
			phone: '',
			province: '',
			town: '',
			name: '',
			userId: '',
		};
		showAddpopup.value.close();
		showBottom.value = true;
	};
	// 修改地址变化
	const userAddressChange = (obj) => {
		orderData.value.orderUser.userId = obj.userId;
		orderData.value.orderUser.address = obj.address;
		orderData.value.orderUser.area = obj.area;
		orderData.value.orderUser.city = obj.city;
		orderData.value.orderUser.province = obj.province;
		orderData.value.orderUser.town = obj.town;
		orderData.value.orderUser.name = obj.name;
		orderData.value.orderUser.phone = obj.phone;
		store.commit('setUserOrder', orderData.value.orderUser);
	};
	// 获取重单设置
	const repeatOrderObj = ref({
		enableGoodsModel: true, //型号
		enableGoodsName: false, //商品名称
		enableOrderModule: false, //工单模块
		enableSNCode: false, //SN码、一物一码
		enableUserName: true, //客户名称
		enableUserPhone: true, //客户手机号
	});
	const getRepeatOrderSetFun = async () => {
		await apiOrder.getRepeatOrderSet().then((res) => {
			uni.hideLoading();
			if (res.code == 20000) {
				repeatOrderObj.value = res.data.row;
			}
		});
	};
	/**
	 * 重单字段查询
	 */
	const repeatSearch = ref({
		codeIds: [], //商品SN码
		goodsIds: [], //商品IDs
		moduleId: '', //模块ID
		userPhone: '', //客户手机号
		username: '', //客户姓名
		historyOrderModuleId: '', //历史工单查重 工单类型/模块ID
		historyOrderUserPhone: '', //历史工单查重 客户手机号
		historyOrderCodeIds: [], //历史工单查重 工单报单SN码
	});
	const getRepeatOrderFun = (dataVo, val = '') => {
		uni.showLoading({
			mask: true,
			title: '加载中...',
		});
		return apiOrder.getRepeatOrder(dataVo).then((res) => {
			uni.hideLoading();
			if (res.code == 20000) {
				// 判断是否重复报单
				if (res.data.row.repeatOrder) {
					// 判断是否开启重复报单
					if (res.data.row.enableRepeatOrder) {
						if (res.data.row.enableRepeatOrderTip) {
							uni.showModal({
								title: '提示',
								content: val + '存在重复工单，继续报单或取消报单!',
								success: function (res) {
									if (res.confirm) {
										onSaveOrder();
										return false;
									} else if (res.cancel) {
										return true;
									}
								},
							});
							return true;
						}
					} else {
						// 不开启重复报单
						uni.showModal({
							title: '提示',
							content: val + '存在重复工单，不允许报单!',
							confirmText: '确定',
							showCancel: false,
							success: function (res) {
								if (res.confirm) {
									return true;
								}
							},
						});
						return true;
					}
				}
				onSaveOrder();
			}
		});
	};
	const token = ref(''); //获取token值
	const addressRef = ref(); //地址组件元素
	const addressValue = ref({
		province: '', //省
		city: '', //市
		area: '', //区
		town: '', //镇
	});
	const color_text = ref('');
	// 故障分类
	const faultTypeRelationVos = ref([]);
	const getFaultType = () => {
		apiOrder.getFaultType().then((res) => {
			if (res.code == 20000) {
				faultTypeRelationVos.value = res.data.row.map((o) => {
					return {
						text: o.name,
						value: o.id,
						disable: o.disabled,
					};
				});
			}
		});
	};
	// 故障分类
	const faultList = ref([]);
	const getFaultByFaultType = () => {
		let data = [];
		data = orderData.value.faultTypeRelationVos.map((o) => {
			return {
				oneFaultTypeId: o,
				threeFaultTypeId: 0,
				twoFaultTypeId: 0,
			};
		});
		if (data.length == 0) {
			orderData.value.faultRelationVos = [];
			faultList.value = [];
			return;
		}
		apiOrder.getFaultByFaultType(data).then((res) => {
			if (res.code == 20000) {
				faultList.value = res.data.rows;
			}
		});
	};
	//获取故障原因 解决措施
	const faultReasonList = ref([]);
	const solutionList = ref([]);
	const faultIdsFn = (val, item) => {
		let arr1 = [];
		let arr2 = [];
		if (item?.faultReason) {
			arr1 = item.faultReason.map((o) => {
				o.idParent = item.id;
				return o;
			});
		}
		if (item?.solution) {
			arr2 = item.solution.map((o) => {
				o.idParent = item.id;
				return o;
			});
		}
		faultReasonList.value = [...arr1, ...faultReasonList.value] || [];
		solutionList.value = [...arr2, ...solutionList.value] || [];
		faultReasonList.value = faultReasonList.value.filter((o) => {
			if (orderData.value.faultRelationVos.includes(o.idParent)) {
				return o;
			} else {
				orderData.value.faultReason = orderData.value.faultReason.filter(
					(i) => !(i == o.id),
				);
			}
		});
		solutionList.value = solutionList.value.filter((o) => {
			if (orderData.value.faultRelationVos.includes(o.idParent)) {
				return o;
			} else {
				orderData.value.solution = orderData.value.solution.filter(
					(i) => !(i == o.id),
				);
			}
		});
	};
	// 获取自定义字段
	const getModuleField = (id) => {
		apiOrder.getModuleField(id).then((res) => {
			if (res.code == 20000) {
				if (res.data.rows.length > 0) {
					orderData.value.workFieldVal = res.data.rows.map((o) => {
						o.id = null;
						o.contents = o.contents.map((i) => {
							return {
								text: i.val,
								value: i.val,
							};
						});
						if (o.type == 5 || o.type == 6 || o.type == 7) {
							o.imgarr = [];
						} else if (o.type == 4) {
							o.value = [];
						} else {
							o.value = '';
						}
						return o;
					});
				}
			}
		});
	};
	// 商品扫码报单
	const getgoodsDetail = async () => {
		uni.showLoading({
			title: '加载中...',
			mask: true,
		});
		return await apiOrder
			.getOrderCodeInfo({code: goodsCode.value, is_add: true})
			.then((res) => {
				uni.hideLoading();
				return res;
			});
	};
	//  客户已登记商品
	const addMyGoods = (item, type = null, isCode = false) => {
		if (item?.userId && isCode) {
			orderData.value.orderUser.userId = item.userId;
			orderData.value.orderUser.address = item.address;
			orderData.value.orderUser.area = item.area;
			orderData.value.orderUser.city = item.city;
			orderData.value.orderUser.province = item.province;
			orderData.value.orderUser.town = item.town;
			orderData.value.orderUser.name = item.userName;
			orderData.value.orderUser.phone = item.userPhone;
			store.commit('setUserOrder', orderData.value.orderUser);
		}
		let tmp = {
			buyTime: item?.buyTime || '',
			buyMarket: item?.buyMarket || '',
			codeIds: isHistory.value
				? item.goodsCodes.map((o) => o.codeId)
				: type
				? item.codeIds
				: [item.id],
			endTime: item.endTime || '',
			goodsId: item.goodsId,
			goodsSpecId: item.goodsSpecId,
			id: type ? item.id : '',
			qty: item.qty || 1,
			name: item.goodsName,
			specName: item.goodsSpecName || item.goodsSpec,
			code: item.code || item.goodsCodes[0]?.code,
			brandId: item.goodsBrandId || '',
			brand: item.goodsBrand || '',
			type: item.goodsType,
			model: item.goodsModel || '',
			image: item.goodsImage || '',
			goodsCode: item.goodsCode,
			typeGoods: type || 1, //1-客户已登记商品，2-未登记商品，3-商品信息
		};
		if (type) {
			return tmp;
		} else {
			let orderGoodsTypes = [];
			// orderGoodsTypes.push({type: type || 1, orderGoodsVos: [tmp]});
			const addGood = {
				type: 1,
				brandId: item.goodsBrandId,
				checkClassifyList: [
					{
						classifyId: item.goodsTypeId,
						orderGoodsVos: [
							{
								brand: item.goodsBrand,
								brandId: item.goodsBrandId,
								buyMarket: '',
								buyTime: '',
								code: item.code,
								codeIds: [item.id],
								endTime: item.endTIme || '',
								goodsCode: item.goodsCode,
								goodsId: item.goodsId,
								goodsSpecId: item.goodsSpecId,
								id: '',
								image: '',
								model: item.goodsModel,
								name: item.goodsName,
								qty: 1,
								specName: item.goodsSpecName,
								type: item.goodsType,
								typeGoods: 1,
								typeId: item.goodsTypeId,
							},
						],
					},
				],
			};
			store.commit('setorderGoodsTypesItem', [addGood]);
		}
	};
	// 改变数量
	const changeValue = (item) => {
		let arr = store.state.orderGoodsTypes.map((o) => {
			if (o.type == item.typeGoods) {
				if (o.brandId == item.brandId) {
					o.checkClassifyList = o.checkClassifyList.map((i) => {
						if (i.classifyId == item.typeId) {
							i.orderGoodsVos = i.orderGoodsVos.map((k) => {
								if (k.goodsSpecId == item.goodsSpecId) {
									k.qty = item.qty;
								}
								return k;
							});
						}
						return i;
					});
				}
			}
			return o;
		});
		store.commit('setorderGoodsTypes', arr);
	};

	// 添加地址
	const onaddAddress = () => {
		// uni.navigateTo({
		// 	url: '/pages_network/user/edaddress'
		// })
	};
	// 编辑地址
	const editItem = (item) => {
		// uni.navigateTo({
		// 	url: '/pages_network/user/edaddress?item=' + JSON.stringify(item)
		// })
	};
	// 时间选择弹窗
	const chackTime = () => {
		showpopup.value = true;
	};
	// 返回预约时间选中的值
	const valueChange = (e) => {
		orderData.value.expectedDate = e?.dateVal.date;
		orderData.value.expectedStartTime = e.time.split('~')[0];
		orderData.value.expectedEndTime = e.time.split('~')[1];
		store.commit('setappointmentTime', e);
	};
	// // 获取故障选择的字段
	// const faultTypeList = () => {
	// 	let list = []
	// 	for (let i of store.state.checkedFaultList) {
	// 		i.list.map(o => {
	// 			list.push({ id: i.typeId, name: o })
	// 		})
	// 	}

	// 	return list
	// }
	// 选择的地址
	const itemUser = (item) => {
		if (item.province) {
			chackUseritem.value = item;
			orderData.value.orderUser.address = item.address;
			orderData.value.orderUser.province = item.province;
			orderData.value.orderUser.city = item.city;
			orderData.value.orderUser.area = item.area;
			orderData.value.orderUser.town = item.town;
			orderData.value.orderUser.name = item.username;
			orderData.value.orderUser.phone = item.phone;
			orderData.value.orderUser.userId = item.id;
		} else {
			uni.showToast({
				icon: 'none',
				title: '请补充地址信息',
			});
		}
	};
	// watch(() => store.state.is_new_addressItemId, (n) => {
	// 	if (n) {
	// 		store.state.addressList.filter(o => {
	// 			if (o.id == store.state.is_new_addressItemId) {
	// 				itemUser(o)
	// 				selecAddress()
	// 				store.commit('set_is_new_addressItemId', '')
	// 			}
	// 		})
	// 	}
	// })
	// 确定选中的地址
	const selecAddress = () => {
		store.commit('setUserOrder', orderData.value.orderUser);
		showAddpopup.value.close();
	};
	// 添加商品
	const addGoods = () => {
		var pages = getCurrentPages();
		var pageIndex = pages
			.slice()
			.reverse()
			.findIndex(
				(o) =>
					o.route == 'pages_network/home/addOrder/ordergoods',
			);
		if (pageIndex == -1) {
			uni.navigateTo({
				url: '/pages_network/home/addOrder/ordergoods',
			});
		} else {
			uni.navigateBack({delta: pageIndex});
		}
	};
	const addressSelectList = ref([]);
	// 地址弹窗
	const popupshow2 = async () => {
		// await store.dispatch('seleAddress', 0)
		// searchNamePhone.value = ''
		// addressSelectList.value=[]
		// getNetworkOrderUserAddr()
		showAddpopup.value.open();
	};
	const searchNamePhone = ref(''); //增加查询字段：联系人名称/联系手机号
	const getNetworkOrderUserAddr = _.debounce(
		() => {
			if (searchNamePhone.value.trim()) {
				let data = {
					limit: 0,
					name: searchNamePhone.value,
					page: 0,
				};
				apiOrder.getNetworkOrderUserAddr(data).then((res) => {
					if (res.code == 20000) {
						addressSelectList.value = res.data.rows;
					}
				});
			}
		},
		600,
		{leading: false},
	);
	// 选择图片后触发
	const onsuccessImg = (res) => {
		res.tempFiles.filter((o) => {
			if (o.size > 512 * 1024 && o.extname == 'gif') {
				uni.showToast({
					icon: 'none',
					title: 'GIF 图片超过限制大小',
				});
			} else {
				fileList.value.push(o);
			}
		});
	};

	// 图片从列表移除时触发
	const ondeleteImg = (res) => {
		// fileList.value = fileList.value.filter(o => {
		// 	return o.uuid != res.tempFile.uuid
		// })
	};
	// 删除故障标签
	const setFaultType = (val) => {
		let list = [];
		list = store.state.checkedFaultList.filter((o) => {
			if (o.typeId == val.id) {
				o.list = o.list.filter((i) => {
					if (i == val.name) {
						return !i;
					}
					return i;
				});
				if (o.list.length == 0) {
					return !o;
				}
			}
			return o;
		});
		store.commit('setchackFaultList', list);
	};
	// 选择图片后触发
	const onsuccessImg2 = (item, files) => {
		files.tempFiles.filter((o) => {
			if (o.size > item.uploadSize * 1024 * 1024) {
				uni.showToast({
					icon: 'none',
					title: `图片超过限制大小${item.uploadSize}MB`,
				});
			} else {
				item.imgarr.push(o);
			}
		});
	};
	// 图片从列表移除时触发
	const ondeleteImg2 = (item, file) => {
		item.imgarr = item.imgarr.filter((o) => {
			return o.uuid != file.tempFile.uuid;
		});
	};
	// 上传视频
	const chooseVideoImage = (item, file) => {
		if (file.tempFiles[0].size > item.uploadSize * 1024 * 1024) {
			uni.showToast({
				icon: 'none',
				title: `视频超过限制大小${item.uploadSize}MB`,
			});
		} else {
			item.imgarr.push(file.tempFiles[0]);
		}
	};
	// 附件上传
	function chooseFile(item, files) {
		files.tempFiles.filter((o) => {
			if (o.size > item.uploadSize * 1024 * 1024) {
				uni.showToast({
					icon: 'none',
					title: `pdf超过限制大小${item.uploadSize}MB`,
				});
			} else {
				item.imgarr.push(o);
			}
		});
	}
	// 查看附件
	const lookPDF = (url) => {
		uni.openDocument({
			filePath: url,
			fileType: 'pdf',
			success: function (res) {},
			fail: function (err) {
				uni.showToast({
					icon: 'none',
					title: err,
				});
			},
		});
	};
	// 删除视频
	const delete_video = (item, index) => {
		item.imgarr.splice(index, 1);
	};
	// 提交服务工单
	const baseForm = ref();
	const onsubService = _.debounce(
		async () => {
			if (!store.state.userOrder.province) {
				color_text.value = '#f29e99';
			}
			await baseForm.value
				.validate()
				.then(async (res) => {
					orderData.value.orderUser.address = store.state.userOrder.address; //客户详细地址
					orderData.value.orderUser.area = store.state.userOrder.area; //地址-县/区
					orderData.value.orderUser.city = store.state.userOrder.city; //地址-市
					orderData.value.orderUser.name = store.state.userOrder.name; //客户姓名
					orderData.value.orderUser.phone = store.state.userOrder.phone; //客户手机号
					orderData.value.orderUser.province = store.state.userOrder.province; //地址-省
					orderData.value.orderUser.town = store.state.userOrder.town; //地址-镇
					orderData.value.orderUser.userId = store.state.userOrder.userId; //客户ID
					orderData.value.moduleId = store.state.wayType.id;

					if (store.getters.getTotalList.length == 0) {
						uni.showToast({
							icon: 'none',
							title: '请选择商品',
						});
						return;
					}
					orderData.value.delOrderGoodsIds = goodDelIdList.value;
					if (workId.value) {
						onSaveOrder();
					} else {
						await onSave();
					}
				})
				.catch((err) => {
					let str = err.map((o) => o.errorMessage);
					uni.showToast({
						title: str[0],
						icon: 'none',
						duration: 2000,
					});
				});
		},
		1200,
		{leading: false},
	);
	// 保存提交工单
	const onSave = async () => {
		uni.showLoading({
			mask: true,
			title: '加载中...',
		});
		await getRepeatOrderSetFun();
		repeatSearch.value.historyOrderUserPhone = orderData.value.orderUser.phone;

		repeatSearch.value.historyOrderModuleId = store.state.wayType.id;
		if (repeatOrderObj.value.enableOrderModule) {
			repeatSearch.value.moduleId = store.state.wayType.id;
		}
		if (
			repeatOrderObj.value.enableUserPhone &&
			repeatOrderObj.value.enableUserName
		) {
			repeatSearch.value.userPhone = orderData.value.orderUser.phone;
			repeatSearch.value.username = orderData.value.orderUser.name;
		} else if (repeatOrderObj.value.enableUserName) {
			repeatSearch.value.username = orderData.value.orderUser.name;
			repeatSearch.value.userPhone = '';
		} else if (repeatOrderObj.value.enableUserPhone) {
			repeatSearch.value.userPhone = orderData.value.orderUser.phone;
			repeatSearch.value.username = '';
		}
		let codeIds = [];
		let goodsIds = [];
		const orderGoods = orderData.value.orderGoodsTypes;
		orderGoods.map((o) => {
			o.orderGoodsVos.map((i) => {
				if (i.codeIds.length > 0) {
					codeIds.push(...i.codeIds);
				}
				if (i.goodsId) {
					goodsIds.push(i.goodsId);
				}
			});
		});
		repeatSearch.value.historyOrderCodeIds = codeIds;
		if (
			repeatOrderObj.value.enableGoodsModel ||
			repeatOrderObj.value.enableGoodsName
		) {
			repeatSearch.value.goodsIds = goodsIds;
		} else {
			repeatSearch.value.goodsIds = [];
		}
		if (repeatOrderObj.value.enableSNCode) {
			repeatSearch.value.codeIds = codeIds;
		} else {
			repeatSearch.value.codeIds = [];
		}
		await getRepeatOrderFun(repeatSearch.value);
	};
	const onSaveOrder = async () => {
		// 上传图片获取图片
		// 处理上传图片
		uni.showLoading({
			title: '加载中...',
			mask: true,
		});
		let dataValue = _.cloneDeep(orderData.value);

		// 隐藏
		// dataValue.faultTypeRelationVos = orderData.value.faultTypeRelationVos.map(o => {
		// 	return {
		// 		"oneFaultTypeId": o,
		// 		"threeFaultTypeId": 0,
		// 		"twoFaultTypeId": 0
		// 	}
		// })
		// // 故障现象
		// dataValue.faultRelationVos = orderData.value.faultRelationVos.map(o => {
		// 	let item = faultList.value.find(i => (o == i.id && !(i.id == i.name)))
		// 	let ov = {
		// 		"fault": '',
		// 		"faultId": ''
		// 	}
		// 	if (item) {
		// 		ov = {
		// 			"fault": item.name,
		// 			"faultId": item.id
		// 		}
		// 	} else {
		// 		ov = {
		// 			"fault": o,
		// 			"faultId": ''
		// 		}
		// 	}
		// 	return ov
		// })
		// // 故障原因
		// dataValue.faultReason = orderData.value.faultReason.map(o => {
		// 	let content = faultReasonList.value.find(i => (o == i.id && !(i.id == i.content)))
		// 	if (content) {
		// 		return content
		// 	} else {
		// 		return {
		// 			"content": o,
		// 			"id": ''
		// 		}
		// 	}
		// })
		// // 解决方案/措施
		// dataValue.solution = orderData.value.solution.map(o => {
		// 	let content = solutionList.value.find(i => (o == i.id && !(i.id == i.content)))
		// 	if (content) {
		// 		return content
		// 	} else {
		// 		return {
		// 			"content": o,
		// 			"id": ''
		// 		}
		// 	}
		// })
		if (fileList.value.length > 0) {
			dataValue.images = [];
			for (let i = 0; i < fileList.value.length; i++) {
				let tmp = fileList.value[i];
				if (tmp.uuid) {
					await apiUpload.uploadOrderFile({files: tmp.file}).then((res) => {
						dataValue.images.push({id: null, image: res.data.rows[0]});
					});
				} else {
					dataValue.images.push({
						id: tmp.id,
						image: tmp.url,
					});
				}
			}
		}
		if (dataValue.workFieldVal.length > 0) {
			for (let key in dataValue.workFieldVal) {
				let item = dataValue.workFieldVal[key];
				item['optValue'] = [];
				if (item.type === 4) {
					for (let i = 0; i < item.value.length; i++) {
						let tmp = item.value[i];
						item.contents.find((o) => o.name);
						item.optValue.push({id: '', optValue: tmp});
					}
				} else if (item.type === 5 || item.type === 6) {
					for (let i = 0; i < item.imgarr.length; i++) {
						let tmp = item.imgarr[i];
						if (tmp.uuid) {
							await apiUpload.uploadOrderFile({files: tmp.file}).then((res) => {
								item.optValue.push({id: '', optValue: res.data.rows[0]});
							});
						} else {
							item.optValue.push({
								id: tmp.id,
								optValue: tmp.url,
							});
						}
					}
				} else if (item.type === 7) {
					for (let i = 0; i < item.imgarr.length; i++) {
						let tmp = item.imgarr[i];
						if (tmp.uuid) {
							await apiUpload
								.orderVideoUpload({files: tmp.file})
								.then((res) => {
									item.optValue.push({id: '', optValue: res.data.rows[0]});
								});
						} else {
							item.optValue.push({
								id: tmp.id,
								optValue: tmp.url,
							});
						}
					}
				} else if (item.type == 8) {
					item.optValue = [
						{id: '', optValue: Math.floor(Number(item.value) * 2)},
					];
				} else {
					item.optValue = [{id: '', optValue: item.value}];
				}
			}

			dataValue.workFieldVal = dataValue.workFieldVal.map((o) => {
				return {
					workFieldId: o.workFieldId,
					moduleFieldId: o.moduleFieldId,
					id: o.id,
					name: o.name,
					optionVos: o.optValue,
					type: o.type,
				};
			});
		}

		if (workId.value) {
			await apiOrder.saveUpdateOrder(dataValue, workId.value).then((res) => {
				uni.hideLoading();
				if (res.code == 20000) {
					initializeFn();
				}
			});
		} else {
			await apiOrder.saveOrder(dataValue).then((res) => {
				uni.hideLoading();
				if (res.code == 20000) {
					initializeFn();
				}
			});
		}
	};
	function initializeFn() {
		// 初始化数据
		store.commit('setorderGoodsTypes', []);
		store.commit('setWayType', {});
		store.commit('setcheckBrandItem', {id: null});
		store.commit('setcheckClassifyItem', {id: null});
		store.commit('setappointmentTime', null);
		store.commit('setUserOrder', {
			address: '', //客户详细地址
			area: '', //地址-县/区
			city: '', //地址-市
			helpOtherCreateOrder: false, //	是否代他人建单：0-否，1-是
			name: '', //客户姓名
			otherPhone: '', //其他电话
			phone: '', //客户手机号
			province: '', //地址-省
			town: '', //地址-镇
			userId: null,
		});
		repeatSearch.value = {
			codeIds: [], //商品SN码
			goodsIds: [], //商品IDs
			moduleId: '', //模块ID
			userPhone: '', //客户手机号
			username: '', //客户姓名
			historyOrderModuleId: '', //历史工单查重 工单类型/模块ID
			historyOrderUserPhone: '', //历史工单查重 客户手机号
			historyOrderCodeIds: [], //历史工单查重 工单报单SN码
		};
		if (workId.value) {
			uni.navigateTo({
				url: '/pages_network/order/detail?workId=' + workId.value,
			});
		} else {
			uni.reLaunch({
				url: '/pages_network/order/order',
			});
		}
	}

	// 调起客户端扫码界面，扫码成功后返回对应的结果。

	const iconClick = () => {
		uni.scanCode({
			scanType: ['qrCode', 'barCode'], //扫码类型
			success: async function (res) {
				if (res.result) {
					code.value = res.result;
					addCode();
				}
			},
			fail: (err) => {
				// #ifdef H5
				uni.showToast({
					icon: 'none',
					title: '设备不支持此功能',
					duration: 3000,
				});
				// #endif
			},
		});
	};
	const showCode = () => {
		code.value = '';
		if (popup.value) {
			popup.value.open();
		}
	};
	const addCode = _.debounce(
		async () => {
			if (!code.value.trim()) {
				uni.showToast({
					title: '请先输入条码！',
					icon: 'none',
				});
				return;
			}
			if (popup.value) {
				popup.value.close();
			}
			goodsCode.value = code.value.trim();
			let res = await getgoodsDetail();
			if (res.code == 20000) {
				for (let i = 0; i < orderData.value.orderGoodsTypes.length; i++) {
					for(let j = 0; j < orderData.value.orderGoodsTypes[i].orderGoodsVos.length; j++) {
						const good = orderData.value.orderGoodsTypes[i].orderGoodsVos[j]
						if (good.code === res.data.row.code) {
							uni.showModal({
								title: '提示',
								showCancel: false,
								confirmText: '确认',
								confirmColor: '#007cff',
								content: '条码已添加！',
							});
							return false
						}
					}
				}
				addMyGoods(res.data.row, null, true);
			} else if (res.code == 400305) {
				uni.showModal({
					title: '提示',
					showCancel: false,
					confirmText: '确认',
					confirmColor: '#007cff',
					content: res.message + '或去添加商品',
				});
			}
		},
		700,
		{leading: false},
	);

	watch(
		() => store.state.orderGoodsTypes,
		(value) => {
			orderData.value.orderGoodsTypes = [];
			const customerRegisteredGoodList = [];
			const goodList = [];
			value.forEach((brand) => {
				brand.checkClassifyList.forEach((classify) => {
					classify.orderGoodsVos.forEach((good) => {
						for (let i = 0; i < good.qty; i++) {
							const addGood = {
								brand: good.brand,
								brandId: good.brandId,
								buyMarket: good.buyMarket,
								buyTime: good.buyTime,
								code: good.code,
								codeIds: good.codeIds,
								endTime: good.endTime,
								goodsCode: good.goodsCode,
								goodsId: good.goodsId,
								goodsSpecId: good.goodsSpecId,
								id: good.id || '',
								image: '',
								model: good.goodsModel,
								name: good.name,
								qty: 1,
								specName: good.specName,
								type: good.type,
								typeGoods: good.typeGoods,
								typeId: good.typeId,
							};
							if (good.typeGoods === 1) {
								customerRegisteredGoodList.push(addGood);
							}

							if (good.typeGoods === 3) {
								goodList.push(addGood);
							}
						}
					});
				});
			});
			if (customerRegisteredGoodList.length > 0) {
				orderData.value.orderGoodsTypes.push({
					orderGoodsVos: customerRegisteredGoodList,
					type: 1,
				});
			}
			if (goodList.length > 0) {
				orderData.value.orderGoodsTypes.push({
					orderGoodsVos: goodList,
					type: 3,
				});
			}
		},
		{deep: true, immediate: true},
	);
</script>

<style lang="scss" scoped>
	.multiple-fill-buy-mall-time {
		font-size: 28rpx;
		display: flex;
		padding: 24rpx;
		background-color: #fff;
		justify-content: space-between;

		.btn {
			font-weight: bold;
			color: #000;
		}
	}

	.scan-query-popup {
		:deep(.uni-popup__wrapper) {
			margin-bottom: 200rpx;
		}
	}

	.fill-buy-mall-time-popup-container {
		width: 550rpx;
		background-color: #fff;
		font-size: 24rpx;

		.header {
			display: flex;
			padding: 24rpx;
			justify-content: space-between;

			.placeholder {
				opacity: 0;
			}

			.title {
				font-size: 28rpx;
			}
		}

		.form {
			padding: 24rpx 24rpx 48rpx 24rpx;
			display: flex;
			flex-direction: column;
			row-gap: 24rpx;

			.mall,
			.time {
				display: flex;
				flex-direction: column;
				row-gap: 8rpx;
			}

			.mall {
				.value {
					:deep(.uni-easyinput) {
						.uni-easyinput__content {
							.uni-easyinput__content-input {
								height: 56rpx;
							}
						}
					}
				}
			}

			.time {
				.value {
					.date {
						padding: 0 0 0 18rpx;
						column-gap: 4rpx;
						display: flex;
						height: 56rpx;
						border: 2rpx solid #dcdfe6;
						border-radius: 10rpx;
						align-items: center;
						color: #999;
					}
				}
			}
		}

		.footer {
			display: flex;
			height: 72rpx;
			border-top: 2rpx solid #dcdfe6;

			.divider {
				width: 2rpx;
				height: 100%;
				background-color: #dcdfe6;
			}

			.confirm-btn,
			.cancel-btn {
				flex: 1;
				display: flex;
				justify-content: center;
				align-items: center;
			}

			.confirm-btn {
				color: #007cff;
			}
		}
	}

	.add_box {
		background-color: #fafafa;
		/* #ifdef H5 */
		height: calc(100vh - 44px);
		/* #endif */
		/* #ifndef H5 */
		height: 100vh;
		/* #endif */
		overflow-y: hidden;
		display: flex;
		flex-direction: column;

		.fixed {
			// position: fixed;
			top: 0;
			left: 0;
			z-index: 99;
			width: 100%;

			.navbar-content {
				position: relative;
				display: flex;
				align-items: center;
				justify-content: center;
				width: 100%;
				height: 80rpx;
				background-color: #007cff;

				.back_btn {
					margin-left: 24rpx;
					position: relative;
					z-index: 9;
					left: 0;
					flex: 1;
					display: flex;
					justify-content: flex-start;
				}

				.navBar {
					display: flex;
					justify-content: center;
					align-items: center;
					text-align: center;
					position: absolute;
					top: 0;
					bottom: 0;
					width: 74%;
					height: 100%;
					color: #fff;

					.text_title {
						overflow: hidden;
						white-space: nowrap;
						text-overflow: ellipsis;
						font-size: 1rem !important;
					}
				}
			}
		}

		.custom-title {
			font-size: 28rpx;
			text-align: center;
		}

		:deep(.uni-modal__bd) {
			color: #f56c6c !important;
		}

		:deep(.uni-modal__title) {
		}

		:deep(.uni-modal__btn_primary) {
			color: #999 !important;
		}

		:deep(.uni-modal__btn_default) {
			color: #f56c6c !important;
		}

		.star {
			color: #dd524d;
			font-size: 28rpx;
			font-weight: bold;
		}

		.address_btn {
			position: fixed;
			bottom: 0rpx;
			right: 0;
			left: 0;
			z-index: 6;
			background-color: #fff;
			border-top: 1rpx solid #eee;

			.btn_addres {
				padding: 30rpx 0 30rpx;

				:deep(button:after) {
					border: none !important;
				}

				.btn {
					border-radius: 50rpx;
					height: 80rpx;
					line-height: 80rpx;
					font-size: 30rpx;
					background-color: #007cff;
					margin: 0 48rpx;
				}

				.btn_bg {
					border-radius: 50rpx;
					height: 80rpx;
					line-height: 80rpx;
					font-size: 30rpx;
					background-color: #ccc;
					margin: 0 48rpx;
				}
			}
		}

		.contact_xy {
			display: flex;
			flex-direction: column;
			height: 100%;
			// flex: 1;
			overflow: hidden;

			.scroll_box {
				height: 100%;
				overflow-y: scroll;
				padding: 24rpx;

				&::-webkit-scrollbar {
					width: 0;
					height: 0;
					-webkit-appearance: none;
					color: transparent;
					display: none;
				}

				.scroll_box_cont {
					padding-bottom: 300rpx;
				}
			}

			.link {
				height: 30rpx;
				background-color: #fafafa;
			}

			:deep(.uni-forms-item) {
				.is-input-border {
					border-radius: 0;
				}

				.uni-forms-item__error {
					left: auto;
					right: 0;
					padding-top: 2rpx;
				}
			}

			:deep(.address_item_) {
				.is-direction-top {
					flex-direction: row !important;
					align-items: center;
					padding: 24rpx !important;
				}
			}

			:deep(.uni-forms-item__label) {
				font-size: 28rpx;
				height: 44rpx;
				padding-bottom: 4rpx;
				color: #000;
				line-height: normal;
			}

			:deep(.uni-easyinput__content-input) {
				font-size: 28rpx;
			}

			.uni_form {
				padding-bottom: 2rpx;
				display: flex;
				flex-direction: column;
				row-gap: 24rpx;
				padding-top: 24rpx;

				.user_info {
					padding-top: 20rpx;
				}

				:deep(.uni-forms-item) {
					background-color: #fff;
					margin: 0;
					padding: 0 24rpx;

					.uni-select {
						// border: none;
						// border-bottom: solid 1px #eee;
						border-radius: 0;
						// height: 28px;
						// padding: 0;
					}

					.team_type {
						height: 100%;
						display: flex;
						align-items: center;
						// margin-left: 20rpx;
						flex: 1;
					}

					.uni-select__input-placeholder {
						font-size: 28rpx;
					}

					.team_type_ {
						border-bottom: solid 1px #eee;
					}

					.addressListStr_type {
						height: 100%;
						display: flex;
						align-items: center;
						justify-content: space-between;
						padding-left: 20rpx;
						border-bottom: solid 1px #eee;
						max-height: 280rpx;
						overflow: auto;

						/* Firefox */
						&::-webkit-scrollbar {
							width: 0;
							height: 0;
							background-color: transparent;
						}

						.icon_btn {
							margin-right: 10rpx;
						}

						.tip {
							font-size: 28rpx;
							color: #999;
						}
					}

					.btn_input {
						display: flex;
						align-items: center;
						height: 35px;
						border-bottom: solid 1px #eee;
						width: 100%;

						.uniui-bottom::before {
							// color: #999;
							font-size: 14px;
						}

						.icon {
							top: -20%;
						}
					}
				}

				:deep(.uni-easyinput__content-textarea) {
					height: 100%;
					line-height: normal;
					min-height: 120rpx;
					max-height: 300rpx;
					margin: 0;
					padding: 12rpx 20rpx;
					overflow: auto;
					font-size: 28rpx;
				}

				.pic_img {
					:deep(.icon-add) {
						width: 26rpx;
						height: 4rpx;
						background-color: #999;
					}

					:deep(.icon-del) {
						width: 24rpx;
					}

					:deep(.icon-del-box) {
						width: 40rpx;
						height: 40rpx;
						top: 0;
						right: 0;
						background-color: rgba(0, 0, 0, 0.3);
					}

					:deep(.file-picker__box-content) {
						border-radius: 0 !important;

						.file-picker__progress {
							display: none !important;
						}
					}
				}

				:deep(.file-picker__progress-item) {
					display: none;
				}

				.pic_video {
					display: flex;
					align-items: center;
					flex-wrap: wrap;
					gap: 20rpx;

					.list_video {
						display: flex;
						align-items: center;
						flex-wrap: wrap;

						.box_video {
							width: 120rpx;
							height: 120rpx;
							// margin-right: 20rpx;
							// margin-bottom: 20rpx;
							position: relative;

							.clear_icon {
								position: absolute;
								top: 0;
								right: 0;
								z-index: 2;
								width: 40rpx;
								height: 40rpx;
								display: flex;
								align-items: center;
								justify-content: center;

								&:after {
									content: '';
									background-color: rgba(0, 0, 0, 0.3);
									position: absolute;
									top: 0;
									right: 0;
									z-index: -1;
									width: 40rpx;
									height: 40rpx;
									border-radius: 50%;
								}
							}

							.item_video {
								width: 100%;
								height: 100%;
							}
						}

						.box_video_pdf {
							width: 120rpx;
							height: 120rpx;
							// margin-right: 20rpx;
							// margin-bottom: 20rpx;
							position: relative;

							.pdf_sty {
								background-color: rgb(250, 81, 81);
								width: 100%;
								height: 100%;
								color: #fff;
								text-align: center;
								font-size: 22rpx;
								position: relative;
								display: flex;
								align-items: center;
								justify-content: center;

								&:before {
									content: '';
									position: absolute;
									z-index: 2;
									border: 12rpx solid #0000002b;
									right: 0rpx;
									top: 0rpx;
									border-top: 12rpx solid #fff;
									border-right: 12rpx solid #fff;
								}
							}

							.clear_icon {
								position: absolute;
								top: 0;
								right: 0;
								z-index: 4;
								width: 40rpx;
								height: 40rpx;
								display: flex;
								align-items: center;
								justify-content: center;

								&:after {
									content: '';
									background-color: rgba(0, 0, 0, 0.3);
									position: absolute;
									top: 0;
									right: 0;
									z-index: -1;
									width: 40rpx;
									height: 40rpx;
									border-radius: 50%;
								}
							}
						}
					}

					.btn_uploader {
						border: 1px solid #eeeeee;
						width: 120rpx;
						height: 120rpx;
						display: flex;
						justify-content: center;
						align-items: center;
						border-radius: 0;
						// margin-right: 20rpx;
						// margin-bottom: 20rpx;
						position: relative;
						overflow: hidden;

						.icon_plus {
							width: 100%;
							height: 100%;
							display: flex;
							justify-content: center;
							align-items: center;
						}
					}

					:deep(.uni-file-picker__files) {
						position: absolute;
						top: 0;
						right: 0;
						z-index: 4;
						width: 100%;
						height: 100%;
						opacity: 0;
					}
				}

				:deep(.is-input-border) {
					// border: none;
					// border-bottom: 1rpx solid transparent;
					border-radius: 0;

					// &.is-focused {
					// 	// border-bottom: 1rpx solid #007cff99;

					// 	.uniui-clear,
					// 	.uniui-eye-filled {

					// 		color: #007cff99 !important;
					// 	}
					// }
				}

				// :deep(.is-textarea){
				// 	border-bottom: 1rpx solid transparent;
				// 	&.is-focused {
				// 		border-bottom: 1rpx solid transparent;

				// 		.uniui-clear,
				// 		.uniui-eye-filled {

				// 			color: #007cff99 !important;
				// 		}
				// 	}
				// }
			}

			:deep(.uni_list) {
				border-radius: 10rpx;

				.other_order {
					display: flex;
					align-items: center;
				}
			}

			:deep(.uni-date-x--border) {
				border-radius: 0;

				.uni-date-x {
					border-radius: 0;
				}
			}

			.mg_top {
				background-color: #fff;
				padding: 24rpx 0;
				display: flex;
				flex-direction: column;
				row-gap: 24rpx;

				.sel_ku {
					font-size: 28rpx;
					color: #999;
					line-height: 42rpx;
				}

				.message {
					// margin: 0 30rpx;
					border: solid 1px #eee;
					flex: 1;

					:deep(textarea) {
						font-size: 28rpx;
						// width: 600rpx;
						flex: 1;
						min-height: 100rpx;
						padding: 10rpx 14rpx 0;
						max-height: 200rpx;
						overflow: auto;
					}

					.big_input {
						display: flex;
						font-size: 28rpx;
						flex-wrap: wrap;
						color: #007cff;
						margin: 10rpx 0rpx 0rpx;

						.input_item {
							background-color: #fff;
							border-radius: 10rpx;
							padding: 4rpx 10rpx;
							margin-bottom: 10rpx;
							transform: scale(0.9);

							.icon_close {
								margin-left: 6rpx;
							}
						}
					}
				}

				:deep(.tiao_jian) {
					display: flex;
					column-gap: 4rpx;
					padding-bottom: 10rpx;

					.text {
						font-size: 24rpx;
						color: #999;
						flex: 1;
						line-height: 19px;
					}
				}

				.pic_img {
					:deep(.icon-add) {
						width: 26rpx;
						height: 4rpx;
						background-color: #999;
					}

					:deep(.icon-del) {
						width: 24rpx;
					}

					:deep(.icon-del-box) {
						width: 40rpx;
						height: 40rpx;
						top: 0;
						right: 0;
						background-color: rgba(0, 0, 0, 0.3);
					}

					:deep(.file-picker__box-content) {
						border-radius: 0 !important;

						.file-picker__progress {
							display: none !important;
						}
					}
				}
			}

			.por_card {
				background-color: #fafafa;
				display: flex;
				flex-direction: column;
				row-gap: 24rpx;

				.type-list {
					display: flex;
					flex-direction: column;
					row-gap: 24rpx;

					.good-list {
						display: flex;
						flex-direction: column;
						row-gap: 24rpx;
					}
				}

				/* Firefox */
				&::-webkit-scrollbar {
					width: 0;
					height: 0;
					background-color: transparent;
				}

				.goods_item {
					display: flex;
					flex-direction: column;
					background-color: #fff;
					border-radius: 10rpx;
					border: 1px solid #eee;
					padding: 24rpx 14rpx;
					padding-right: 0;
					box-sizing: border-box;
					position: relative;
					row-gap: 24rpx;

					.goods_item_left {
						display: flex;
						// align-items: center;
						width: 100%;

						.item_img {
							// margin: 0 20rpx;
							width: 130rpx;
							height: 130rpx;
							background-color: #fff;
							border-radius: 4rpx;
							border: 2rpx solid #eee;

							._img {
								width: 130rpx;
								height: 130rpx;
								border-radius: 4rpx;
							}
						}

						.item_title {
							font-size: 24rpx;
							margin-left: 16rpx;
							flex: 1;
							margin-right: 14rpx;
							display: flex;
							flex-direction: column;
							row-gap: 8rpx;

							.item_title_header {
								display: flex;
								justify-content: space-between;
								align-items: center;
								position: relative;
								column-gap: 12rpx;

								.delete_item {
									width: 60rpx;
									height: 40rpx;

									.del_btn {
										position: absolute;
										top: -4rpx;
										right: 0;
									}
								}
							}

							.item_title_name {
								margin: 10rpx 0 10rpx;
								font-weight: bold;
								font-size: 28rpx;
								display: -webkit-box;
								-webkit-line-clamp: 2;
								-webkit-box-orient: vertical;
								overflow: hidden;
								word-wrap: break-word;
								word-break: break-all;
							}

							.item_title_text_brand {
								font-size: 28rpx;
								display: -webkit-box;
								-webkit-line-clamp: 2;
								-webkit-box-orient: vertical;
								overflow: hidden;
								word-wrap: break-word;
								word-break: break-all;
							}

							.item_title_text {
								font-size: 24rpx;
								color: #999;
								display: flex;
								flex-wrap: wrap;

								.item_title_color {
									color: #000;
									flex: 1;
									display: -webkit-box;
									-webkit-line-clamp: 2;
									-webkit-box-orient: vertical;
									overflow: hidden;
									word-wrap: break-word;
									word-break: break-all;
								}
							}

							.item_title_code {
								font-size: 24rpx;
								color: #999;
								display: flex;
								justify-content: space-between;
								align-items: center;
								position: relative;
								margin-top: 8rpx;

								.item_title_color {
									color: #000;
									flex: 1;
									display: -webkit-box;
									-webkit-line-clamp: 2;
									-webkit-box-orient: vertical;
									overflow: hidden;
									word-wrap: break-word;
									word-break: break-all;
								}
							}

							.number {
								display: flex;
								justify-content: flex-end;
								width: 100%;
								flex: 1;
								text-align: right;
							}
						}
					}
				}
			}

			.address_item {
				display: flex;
				// align-items: center;
				justify-content: flex-end;
				flex: 1;

				// .sel_address {
				// 	font-size: 28rpx;
				// 	color: #000;
				// 	width: 100%;
				// 	text-align: right;
				// 	flex: 1;
				// 	display: flex;
				// 	align-items: center;
				// 	justify-content: flex-end;

				// 	.text_9 {
				// 		color: #999;
				// 		line-height: 42rpx;

				// 	}

				// 	.address_tip {
				// 		// width: 80%;
				// 		white-space: pre-wrap;

				// 	}

				// 	.tipadd {
				// 		margin-bottom: 8rpx;
				// 		white-space: nowrap;
				// 		overflow: hidden;
				// 		text-overflow: ellipsis;

				// 		.user_name {
				// 			// color: #333;
				// 		}
				// 	}
				// }
			}

			.add_pro {
				color: #007cff;
				display: flex;
				align-items: center;
				justify-content: space-evenly;
				column-gap: 40rpx;
				flex: 1;
				padding-top: 12rpx;

				.way_item {
					flex: 1;
					display: flex;
					align-items: center;
					border: 1px solid #007cff;
					border-radius: 4rpx;
					padding: 12rpx 24rpx;
					justify-content: center;
				}

				.custom-title {
					font-size: 28rpx;
				}
			}
		}
	}

	.popup_main {
		background-color: #fafafa;
		height: 1200rpx;
		border-radius: 20rpx 20rpx 0 0;
		width: 100%;
		position: relative;
		display: flex;
		flex-direction: column;

		.search_card {
			display: flex;
			align-items: center;
			margin: 0 24rpx;

			&_bar {
				flex: 1;
			}

			.search_btn {
				font-size: 28rpx;
				color: #007cff;
				font-weight: bold;
			}
		}

		.add_address {
			display: flex;
			justify-content: flex-end;
			color: #007cff;
			cursor: pointer;
			padding: 0 24rpx 24rpx;
			font-size: 28rpx;
		}

		.lable_top {
			text-align: center;
			line-height: 100rpx;
			background-color: #fff;
			border-radius: 20rpx 20rpx 0 0;
			height: 100rpx;

			.icon {
				position: absolute;
				right: 40rpx;
			}
		}

		.sele_ul {
			overflow: auto;
			// height: 100%;
			width: 100%;
			display: flex;
			flex-direction: column;
			row-gap: 24rpx;

			.sele_li {
				background-color: #fff;
				margin: 0 30rpx;
				border-radius: 4rpx;
				padding: 24rpx;
				font-size: 28rpx;
				display: flex;
				justify-content: space-between;
				align-items: center;

				&:last-child {
					margin-bottom: 300rpx;
				}

				.sele_li_item {
					display: flex;
					align-items: center;
					flex: 1;

					.add_ed {
						display: flex;
						flex-direction: column;
						flex: 1;
						margin-left: 14rpx;
						row-gap: 6rpx;

						.user_xx {
							font-size: 28rpx;
							display: flex;
							align-items: center;
							// margin-bottom: 12rpx;

							.user_name {
								font-size: 28rpx;
							}

							.tip {
								border: 1rpx solid #00c0c0;
								margin-left: 30rpx;
								border-radius: 4rpx;
								padding: 2rpx 6rpx;
								color: #00c0c0;
								font-size: 22rpx;
							}
						}

						.text {
							font-size: 28rpx;
							color: #000;
							width: 100%;
							white-space: pre-wrap;
							// margin-top: 12rpx;
						}
					}
				}
			}
		}

		.add_btn {
			position: fixed;
			bottom: 0;
			left: 0;
			right: 0;
			display: flex;
			justify-content: center;
			align-items: center;
			z-index: 3;
			background-color: #fff;
			padding: 30rpx 0;

			.btn {
				flex: 1;
				margin: 0 80rpx;
				background-color: #007cff;
				color: #fff;
				// width: 50%;
				height: 80rpx;
				line-height: 80rpx;
				font-size: 30rpx;
				border-radius: 40rpx;
			}
		}
	}

	.popup-time {
		background-color: #fff;
		height: 600rpx;
		border-radius: 40rpx 40rpx 0 0;
		width: 100%;
		position: relative;
		overflow-y: auto;

		.lable_top {
			text-align: center;
			line-height: 100rpx;
			background-color: #fff;
			border-radius: 40rpx 40rpx 0 0;
			height: 100rpx;
			border-bottom: 1rpx solid #eee;

			.icon {
				position: absolute;
				right: 40rpx;
			}
		}

		.bodyer_time {
			display: flex;
			height: calc(100% - 102rpx);

			.bodyer-left {
				background-color: #eee;

				.left-item {
					padding: 20rpx;
				}

				.active_item {
					background-color: #fff;
					color: #007cff;
				}
			}

			.bodyer-rigth {
				.left-item {
					padding: 20rpx;
					text-align: center;
				}

				.is-show {
					color: #eee;
				}

				.active_item {
					color: #007cff;
				}
			}
		}
	}

	:deep(.uni-forms-item__content) {
		display: flex;
		align-items: center;
		flex: 1;
	}

	.sel_address {
		margin-left: 24rpx;
		font-size: 28rpx;
		color: #000;
		width: 100%;
		flex: 1;
		display: flex;
		align-items: center;
		justify-content: flex-end;

		.text_9 {
			color: #999;
			line-height: 42rpx;
		}

		.address_tip {
			// width: 80%;
			white-space: pre-wrap;
		}

		.tipadd {
			// overflow: hidden;
			// text-overflow: ellipsis;
			display: flex;
			flex-wrap: wrap;
			align-items: center;
			word-wrap: break-word;
			word-break: break-all;
			text-align: right;
			justify-content: flex-end;

			.user_name {
				text-align: right;
			}
		}
	}

	.add_main {
		background-color: #fff;
		border-radius: 10rpx;
		width: 80vw;
		display: flex;
		flex-direction: column;
		align-items: center;
		padding: 34rpx;
		box-sizing: border-box;

		.text_top_popup {
			text-align: center;
			font-size: 28rpx;
			padding: 0rpx 0 20rpx;
			width: 100%;
			position: relative;

			.icon {
				position: absolute;
				right: 0rpx;
				font-weight: 500;
			}
		}

		.onlogout {
			font-size: 28rpx;
			margin: 30rpx 20rpx 0;
			height: 80rpx;
			border-radius: 50rpx;
			line-height: 80rpx;
			width: 100%;
			color: #fff;
			background-color: #007cff;
		}

		:deep(.is-input-border) {
			// border-radius: 50rpx !important;
			background-color: rgba(243, 244, 248, 1) !important;
			padding: 10rpx;
			margin-top: 20rpx;
			border: none;
			height: 80rpx !important;
			line-height: 80rpx;
			font-size: 28rpx;
		}
	}
</style>
